{% extends 'based.html' %}

{% block header %}
<head>
<title>Allert information</title>
<script src="http://maps.google.com/maps?file=api&v=2&key={{ API_KEY }}"
  type="text/javascript"></script>
<script src="http://www.google.com/uds/api?file=uds.js&v=1.0&key={{ API_KEY }}"
  type="text/javascript"></script>
<script src="http://www.google.com/uds/solutions/localsearch/gmlocalsearch.js"
  type="text/javascript"></script>
<style type="text/css">
  @import url("http://www.google.com/uds/css/gsearch.css");
  @import url("http://www.google.com/uds/solutions/localsearch/gmlocalsearch.css");
</style>
<!-- Individual YUI CSS files --> 
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/yui/2.6.0/build/reset-fonts-grids/reset-fonts-grids.css"> 
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/yui/2.6.0/build/base/base-min.css"> 
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/yui/2.6.0/build/button/assets/skins/sam/button.css"> 
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/yui/2.6.0/build/menu/assets/skins/sam/menu.css"> 
<!-- Individual YUI JS files --> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/yui/2.6.0/build/yahoo-dom-event/yahoo-dom-event.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/yui/2.6.0/build/element/element-beta-min.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/yui/2.6.0/build/container/container_core-min.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/yui/2.6.0/build/menu/menu-min.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/yui/2.6.0/build/button/button-min.js"></script> 

<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false&amp;key={{ API_KEY }}" type="text/javascript"></script>
    <script type="text/javascript">

    function initialize() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map_canvas"));
        map.setCenter(new GLatLng({{ lat }}, {{ lon }}), 13);
      }
    }

    </script>
{% endblock %}

{% block body %}
  <body onload="initialize()" onunload="GUnload()">
<a href="/"><img src="/static/banner.png" border=0></a>
<div align="center" id="allert">
    <table>
      <tr>
        <td><div align="center" id="home"><a href="/">HOME</a></div></td>
      </tr>
      <tr>
        <td>
          <div id="allert_data">
            <p>Sender: {{ allert.sender }}</p>
            <p>Contact: {{ allert.contact }}</p>
            <p>Description: {{ allert.description|escape }}</p>
            <p>Category: {{ allert.category }}</p>
            <p>Special Care: {{ allert.specialcare }}</p>
            <p>Date: {{ allert.date|date:"r"  }}</p>
          </div>
        </td>
      </tr>
      <tr>
        <td>
          <div id="pic_canvas" style="width: 250px; height: 200px">
            <a href="/pic_view?k={{ allert.key }}" class="pic_url">
              <img src="/pic?k={{ allert.key }}" border="0" width="250px" height="200px">
            </a>
          </div>
        </td>
      </tr>
      <tr>
        <td>
          <div id="map_canvas" style="width: 250px; height: 250px"></div>
        </td>
      </tr>
      <tr>
        <td><div align="center" id="home"><a href="/">HOME</a></div></td>
      </tr>
      <tr>
        <td><div align="center" id="source"><a href="http://code.google.com/p/eallert">Google Code</a></div></td>
      </tr>
    </table>
 </div>
  </body>
{% endblock %}
